<!DOCTYPE html>
<html>
  <head>
    <!--META-->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=0.75">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge">

    <!--CSS-->
    <link rel="stylesheet" href="API/css/themes/default/jquery.mobile.min.css" />
    <link rel="stylesheet" href="API/css/themes/default/jquery.mobile.structure.min.css" />
    <link rel="stylesheet" href="API/css/themes/default/jquery.mobile.theme.min.css" />
    <link rel="stylesheet" href="API/css/mycss.css" />
    <link rel="stylesheet" href="API_RH/css/mycss.css" />
    <link rel="stylesheet" href="css/mycss.css" />

    <!--JS-->
    <script type="text/javascript" src="API/js/jquery.min.js"></script>
    <script type="text/javascript" src="API/js/jquery.mobile.min.js"></script>
    <script type="text/javascript" src="API/js/highcharts.js"></script>
    <script type="text/javascript" src="API/js/modules/exporting.js"></script>
    <!--<script type="text/javascript" src="API/js/jquery.dataTables.min.js"></script>--> 
    <script type="text/javascript" src="include/config.js"></script>
    <script type="text/javascript" src="API/js/fonctions.js"></script>
    <script type="text/javascript" src="API_RH/js/fonctions.js"></script>
    <script type="text/javascript" src="js/fonctions.js"></script>
	
    <script language="javascript" type="text/javascript">
    checkMaintenance();
    checkAuthentification();
	
            ///////////////////
            //BLOCK VARIABLE GLOBAL
            ///////////////////
            var id_page = 10;
            var StockWorker;

            ///////////////////
            //BLOCK FONCTIONS EVENEMENTS
            ///////////////////
            $(document).on('pageinit', function() {
                try {
                    // Init commun
                    init_commun();

                    // Init page
                    inputMoisEnCours('dateDepart', 'dateFin');
                    inputMoisEnCours('dateStatutBegin', 'dateStatutEnd');

                    chargeTabVeilStock();
                    chargeEcartType();
                }
                catch (er) {
                    log(0, "ERROR(init_rapport_autres):" + er.message);
                }
            });

            $(document).on('pageshow', function() {
                try {
                    show_commun();
                }
                catch (er) {
                    log(0, "ERROR(show):" + er.message);
                }
            });

            ///////////////////
            //BLOCK FONCTIONS METIER
            ///////////////////

            function AfficherDomaine1(p_dateBegin, p_dateEnd) {
                try {
                    dateBegin = p_dateBegin;
                    dateEnd = p_dateEnd;

                    if (dateBegin == "") {
                        dateBegin = "01/01/1970";
                    }
                    if (dateEnd == "") {
                        dateEnd = "01/01/2070";
                    }

                    dateStatutBegin = "01/01/1970";
                    dateStatutEnd = "01/01/2070";

                    var reg = new RegExp("[/]", "g");
                    var strDateBegin = dateBegin.replace(reg, '');
                    var strDateEnd = dateEnd.replace(reg, '');
                    var strDateStatutBegin = dateStatutBegin.replace(reg, '');
                    var strDateStatutEnd = dateStatutEnd.replace(reg, '');

                    afficherDomaine(strDateBegin, strDateEnd, strDateStatutBegin, strDateStatutEnd);
                }
                catch (er) {
                    log(0, "ERROR(init):" + er.message);
                }
            }

            function afficherDomaine(p_dateBegin, p_dateEnd, p_dateStatutBegin, p_dateStatutEnd) {
                try {
                    $('#divProd').trigger( "expand" );
            
                    var str_sql = "SELECT domaine FROM tab_inventaire_domaines WHERE 1=1 AND macro_domaine = 'Autres'";
                    var tab_dom = getSQL(str_sql);

                    tabDataUp = new Array();

                    for (var indiceDom in tab_dom) {

                        var str_domaine = tab_dom[indiceDom][0];

                        var tab = new Array();
                        var tabInput = {dateBegin:p_dateBegin, dateEnd:p_dateEnd, dateStatutBegin:p_dateStatutBegin, dateStatutEnd:p_dateStatutEnd, domaine:str_domaine};
                        
                        tab = callBD("phpsql/mysql_getDomaineParDomaine.php", "GET", "text", tabInput, "", false);

                        tabDataMiddle = new Array();
                        tabDataDown = new Array();

                        for (var indice in tab) {
                            jour = tab[indice][0].substring(8, 10);
                            mois = String((tab[indice][0].substring(5, 7)) - 1);
                            annee = tab[indice][0].substring(0, 4);
                            tabDataDown = new Array(Date.UTC(annee, mois, jour), parseInt(tab[indice][1]));
                            tabDataMiddle[tabDataMiddle.length] = tabDataDown;
                        }

                        tabDataUp[tabDataUp.length] = {
                            name: str_domaine,
                            data: tabDataMiddle
                        };
                    }

                    afficheGraphDomaine(tabDataUp);

                }
                catch (er) {
                    log(0, "ERROR(afficherDomaine):" + er.message);
                }
            }
            
            function AfficherProduction3(p_dateStatutBegin, p_dateStatutEnd) {
                try {
                    dateStatutBegin = p_dateStatutBegin;
                    dateStatutEnd = p_dateStatutEnd;

                    dateBegin = "01/01/1970";
                    dateEnd = "01/01/2070";

                    if (dateStatutBegin == "") {
                        dateStatutBegin = "01/01/1970";
                    }
                    if (dateStatutEnd == "") {
                        dateStatutEnd = "01/01/2070";
                    }

                    var reg = new RegExp("[/]", "g");
                    var strDateBegin = dateBegin.replace(reg, '');
                    var strDateEnd = dateEnd.replace(reg, '');
                    var strDateStatutBegin = dateStatutBegin.replace(reg, '');
                    var strDateStatutEnd = dateStatutEnd.replace(reg, '');

                    afficherEvolStockDom(strDateBegin, strDateEnd, strDateStatutBegin, strDateStatutEnd);
                }
                catch (er) {
                    log(0, "ERROR(AfficherProduction3):" + er.message);
                }
            }
            
            function afficherEvolStockDom(p_dateBegin, p_dateEnd, p_dateStatutBegin, p_dateStatutEnd) {
                try {
                    var strhtml = "";
                    
                    $('#divEvolStock').trigger( "expand" );
                    
                    /* Vérifie si les Web Workers sont supportés */
                    if (window.Worker) {
                        strhtml += "<IMG SRC=\"API/img/loading.gif\" ALT=\"Chargement\" TITLE=\"Chargement\">";
                        $('#divEvolStock').html(strhtml);

                        StockWorker = initWorker("WorkerEvolStockAutres.js", "afficherEvolStockDom_retour");
                        
                        var json_param = {
                            dateBegin : p_dateBegin,
                            dateEnd : p_dateEnd,
                            dateStatutBegin : p_dateStatutBegin,
                            dateStatutEnd : p_dateStatutEnd
                        }

                        StockWorker.postMessage(new WorkerMessage('calcule', json_param)); 
                    }
                    else {
                        $('#divEvolStock').html("Les Web Workers ne sont pas supportés par votre navigateur. Réessayez avec IE10 : <a href=\"http://ie.microsoft.com/testdrive\">téléchargez la dernière Platform Preview d'IE10 </a>");
                    }
                    
                }
                catch (er) {
                    log(0, "ERROR(afficherEvolStockDom):" + er.message);
                }
            }

            function afficherEvolStockDom_retour(p_message) {
            try {
                switch (p_message.cmd) {
                    case 'avancement':
                        var percent = p_message.parameter;
                        $('#divEvolStock').html("<p>Avancement de la t&acirc;che...<strong><label id=\"labelProgress\">"+percent+"</label>%</strong><progress id=\"avancementProd\" value=\""+percent+"\" max=\"100\"></progress><img src=\"API/img/loading.gif\" alt=\"loading\" style=\"vertical-align:middle;\" /><br><a href=\"javascript:terminateStockWorker();\">Annuler</a></p>").trigger('create');
                        break;
                    case 'resultats':
                        terminateWorker(StockWorker);
                        afficheGraphEvolStockDom(p_message.parameter);
                    break;
                    case 'stats':
                        $('#statEvolStock').html("Génération de l'analyse en "+p_message.parameter+".");
                    break;
                    }
                }
                catch (er) {
                    log(0, "ERROR(afficherEvolStockDom_retour):" + er.message);
                }
            }

            function chargeTabVeilStock() {
                try {
                    var tabInput = {};
                    callBD("phpsql/mysql_getVeillissementStockAutres.php", "GET", "text", tabInput, "chargeTabVeilStock_retour");
                }
                catch (er) {
                    log(0, "ERROR(chargeTabVeilStock):" + er.message);
                }
            }

            function chargeTabVeilStock_retour(p_retour) {
                try {
                    var tabResultat = new Array();

                    tabResultat = p_retour;

                    var tabCat = new Array();

                    for (var indice in tabResultat) {
                        tabCat[tabCat.length] = tabResultat[indice][0];
                    }

                    var tabSeries = new Array();
                    var tabSubSeries = new Array();
                    var tabSubSeries_horsSn3 = new Array();
                    var tabSubSeries_Sn3 = new Array();
                    var tabSubSeries_retour = new Array();
                    var tabSubSeries_emis = new Array();

                    for (var indice in tabResultat) {
                        tabSubSeries[tabSubSeries.length] = parseInt(tabResultat[indice][1]);
                        tabSubSeries_Sn3[tabSubSeries_Sn3.length] = parseInt(tabResultat[indice][2]);
                        tabSubSeries_horsSn3[tabSubSeries_horsSn3.length] = parseInt(tabResultat[indice][3]);
                        tabSubSeries_retour[tabSubSeries_retour.length] = parseInt(tabResultat[indice][4]);
                        tabSubSeries_emis[tabSubSeries_emis.length] = parseInt(tabResultat[indice][5]);
                    }

                    tabSeries[tabSeries.length] = {
                        name: "Total",
                        data: tabSubSeries
                    };

                    tabSeries[tabSeries.length] = {
                        name: "Sn3",
                        data: tabSubSeries_Sn3
                    };

                    tabSeries[tabSeries.length] = {
                        name: "Hors Sn3",
                        data: tabSubSeries_horsSn3
                    };

                    tabSeries[tabSeries.length] = {
                        name: "Retours",
                        data: tabSubSeries_retour
                    };

                    tabSeries[tabSeries.length] = {
                        name: "Emis",
                        data: tabSubSeries_emis
                    };

                    afficheVeilStock(tabCat, tabSeries);
                }
                catch (er) {
                    log(0, "ERROR(chargeTabVeilStock_retour):" + er.message);
                }
            }
            
            function chargeEcartType() {
                try {
                    var tabInput = {dom:""};
                    callBD("phpsql/mysql_getEcartTypeParDom.php", "GET", "text", tabInput, "chargeEcartType_retour");
                }
                catch (er) {
                    log(0, "ERROR(chargeEcartType):" + er.message);
                }
            }

            function chargeEcartType_retour(p_retour) {
                try {
                    var tabResultat = new Array();

                    tabResultat = p_retour;

                    var strhtml = "";
                    strhtml += "<table data-role=\"table\" data-mode=\"reflow\" class=\"ui-body-d ui-shadow table-stripe ui-responsive\">";
                    strhtml += "<thead>";
                    strhtml += "<TR class=\"ui-bar-d\">";
                    strhtml += "<TH>Dommaine</TH>";
                    strhtml += "<TH>Moyenne</TH>";
                    strhtml += "<TH>Variance</TH>";
                    strhtml += "<TH>Ecart type</TH>";
                    strhtml += "<TH>Bollinger minus</TH>";
                    strhtml += "<TH>Bollinger max</TH>";
                    strhtml += "</thead>";
                    strhtml += "<tbody>";

                    for (var indice in tabResultat) {
                        strhtml += "<TR onMouseOver=\"changeCouleur(this);\" onMouseOut=\"remetCouleur(this);\" >";
                        strhtml += "<TD>" + tabResultat[indice][5] + "</TD>";
                        strhtml += "<TD>" + tabResultat[indice][0] + "</TD>";
                        strhtml += "<TD>" + tabResultat[indice][1] + "</TD>";
                        strhtml += "<TD>" + tabResultat[indice][2] + "</TD>";
                        strhtml += "<TD>" + tabResultat[indice][3] + "</TD>";
                        strhtml += "<TD>" + tabResultat[indice][4] + "</TD>";
                        strhtml += "</TR>";
                    }

                    strhtml += "</tbody>";
                    strhtml += "</table>";

                    $('#divStats').html(strhtml);
                }
                catch (er) {
                    log(0, "ERROR(chargeEcartType_retour):" + er.message);
                }
            }

            
            ///////////////////
            //BLOCK FONCTIONS TECHNIQUES
            ///////////////////
            function terminateStockWorker() {
                try {
                    terminateWorker(StockWorker);
                    $('#divEvolStock').html("Analyse annul&eacute;e");
                }
                catch (er) {
                    log(0, "ERROR(terminateStockWorker):" + er.message);
                }
            }

            ///////////////////
            //BLOCK FONCTIONS BD
            ///////////////////

            ///////////////////
            //BLOCK FONCTIONS AFFICHAGE
            ///////////////////
            function afficheVeilStock(p_tabCat, p_tabSeries) {
                try {
                    var retour = $('#div_tabVeilStock').highcharts({
                        exporting: {
                            url: 'http://export.highcharts.com',
                            filename: 'vieillissement_stock',
                        },
                        chart: {
                            defaultSeriesType: 'column'
                        },
                        title: {
                            text: 'Tickets ouverts compt\351s par mois'
                        },
                        subtitle: {
                            text: 'Source: ODA.'
                        },
                        xAxis: {
                            categories: p_tabCat
                        },
                        yAxis: {
                            min: 0,
                            title: {
                                text: 'Nombre de toc'
                            }
                        },
                        legend: {
                            layout: 'vertical',
                            backgroundColor: '#FFFFFF',
                            align: 'left',
                            verticalAlign: 'top',
                            x: 100,
                            y: 70,
                            floating: true,
                            shadow: true
                        },
                        tooltip: {
                            formatter: function() {
                                return '' + this.y + '.';
                            }
                        },
                        plotOptions: {
                            column: {
                                pointPadding: 0.2,
                                borderWidth: 0
                            }
                        },
                        series: p_tabSeries
                    });
                } catch (er) {
                    log(0, "ERROR(afficheVeilStock):" + er.message);
                }
            }

            function afficheGraphDomaine(tabDataUp) {
                try {
                    var retour = $('#divProd').highcharts({
                        chart: {
                            type: 'spline'
                        },
                        title: {
                            text: 'Snow depth at Vikjafjellet, Norway'
                        },
                        subtitle: {
                            text: 'Irregular time data in Highcharts JS'
                        },
                        xAxis: {
                            type: 'datetime',
                            dateTimeLabelFormats: { // don't display the dummy year
                                month: '%e. %b',
                                year: '%b'
                            }
                        },
                        yAxis: {
                            title: {
                                text: 'Snow depth (m)'
                            },
                            min: 0
                        },
                        tooltip: {
                            formatter: function() {
                                    return '<b>'+ this.series.name +'</b><br/>'+
                                    Highcharts.dateFormat('%e. %b', this.x) +': '+ this.y +' m';
                            }
                        },
                        series: tabDataUp
                    });
                } catch (er) {
                    log(0, "ERROR(afficheVeilStock):" + er.message);
                }
            }

        function afficheGraphEvolStockDom(tabDataUp) {
            try{
                var chart;

                $(function () {
                    var retour = $('#divEvolStock').highcharts({
                        exporting: {
                            url: 'http://export.highcharts.com',
                            filename: 'evolution_stock_autres'
                        },
                        chart: {
                            type: 'spline'
                        },
                        title: {
                            text: 'Evolution des stocks'
                        },
                        subtitle: {
                            text: 'By FRO'
                        },
                        xAxis: {
                            type: 'datetime',
                            dateTimeLabelFormats: {// don't display the dummy year
                                month: '%e. %b',
                                year: '%b'
                            }
                        },
                        yAxis: {
                            title: {
                                text: 'TOC (u)'
                            },
                            min: 0
                        },
                        plotOptions: {
                            series: {
                                marker: {
                                    enabled: false,
                                    states: {
                                        hover: {
                                            enabled: true,
                                            radius: 3
                                        }
                                    }
                                }
                            }
                        },
                        tooltip: {
                            formatter: function() {
                                return '<b>' + this.series.name + '</b><br/>' + Highcharts.dateFormat('%e. %b', this.x) + ': ' + this.y + ' toc(s)';
                            }
                        },
                        series: tabDataUp
                    });
                });
            }catch (er) {
                log(0, "ERROR(afficheGraphEvolStockDom):" + er.message);
            }
        }

        </script>

    </head>
    <body>

        <!-- page -->
        <div data-role="page" data-title="Titre">

            <!-- /panel -->
            <div data-role="panel" id="mypanel" data-display="overlay" data-position="left">

            </div>
            <!-- /panel -->

            <!-- header -->
            <div data-role="header" data-position="fixed">
                <a href="#mypanel" data-role="button" data-icon="home" data-iconpos="notext">home</a>
                <h1 id="id_titre">titre</h1>
                <a href="javascript:window.location = ('./page_contact.html?mili='+getMilise());" data-role="button" data-icon="info" data-iconpos="notext">Contact</a>
            </div>
            <!-- /header -->

            <!-- content -->
            <div data-role="content" id="main_content">
                <div data-role="collapsible" data-collapsed="false" data-mini="true">
                    <h3>Votre recherche</h3>
                    <FORM method="post" id="formulaire" action="#">
                        <span class="sansserif">Pour les tickets cr&eacute;&eacute;s entre</span>
                        <input type="text" id="dateDepart" name="dateDepart" /><span class="sansserif">(DD/MM/YYYY) et</span>
                        <input type="text" id="dateFin" name="dateFin" /> <span class="sansserif">(DD/MM/YYYY)</span>
                        <a href="javascript:inputMoisEnCours('dateDepart','dateFin');" data-role="button" data-inline="true" data-mini="true" title="Mois en cours">M</a>
                        <br />
                        <a class="sansserif" href="javascript:;" onClick="AfficherDomaine1(document.forms.formulaire.dateDepart.value, document.forms.formulaire.dateFin.value);" id="A5">L'arriv&eacute;e par domaine</a>
                        <br />
                        <span class="sansserif">Pour les tickets avec date de statut entre</span>
                        <input type="text" id="dateStatutBegin" name="dateStatutBegin" /><span class="sansserif">(DD/MM/YYYY) et</span>
                        <input type="text" id="dateStatutEnd" name="dateStatutEnd" /> <span class="sansserif">(DD/MM/YYYY)</span>
                        <a href="javascript:inputMoisEnCours('dateStatutBegin','dateStatutEnd');" data-role="button" data-inline="true" data-mini="true" title="Mois en cours">M</a>
                        <br />
                        <a class="sansserif" href="javascript:;" onClick="AfficherProduction3(document.forms.formulaire.dateStatutBegin.value, document.forms.formulaire.dateStatutEnd.value);" id="A5">Le stock par domaine</a>
                        <br />
                    </FORM> 
                </div>

                <div data-role="collapsible" data-collapsed="true" data-mini="true">
                    <h3>L'&eacute;volution des entrants</h3>
                    <div id="divProd" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
                </div>

                <div data-role="collapsible" data-collapsed="true" data-mini="true">
                    <h3>L'&eacute;volution du stock</h3>
                    <div id="divEvolStock">Pas de r&eacute;sultat.</div>
                    <label id="statEvolStock"></label>
                </div>

                <div data-role="collapsible" data-collapsed="false" data-mini="true">
                    <h3>Veillissement du stock</h3>
                    <div id="div_tabVeilStock">Pas de r&eacute;sultat.</div>
                </div>

                <div data-role="collapsible" data-collapsed="false" data-mini="true">
                    <h3>Ecarts Type</h3>
                    <div id="divStats">Pas de r&eacute;sultat.</div>
                </div>
            </div>
            <!-- /content -->

            <!-- footer -->
            <div data-role="footer" data-position="fixed">
                <a data-role="button" data-icon="search" data-iconpos="notext" class="ui-btn-left" href="javascript:window.location = ('./page_faq.html?mili='+getMilise());">FAQ</a>
                <h1 id="id_affichageUser">User</h1>
                <a data-role="button" data-icon="delete" data-iconpos="notext" class="ui-btn-right" href="javascript:window.location = ('./page_sortie.html?mili='+getMilise());">Logout</a>
            </div>
            <!-- /footer -->

        </div>
        <!-- /page -->
    </body>
</html>